body, html{
    height: 100%;
    
}
body{
    overflow-x: hidden;
}
.headtitle {
    position: relative;
}
.headtitle p{
    font-size: 40px;
    color: rgb(51, 51, 51);
}
.headtitle p:nth-child(2){
    font-size: 16px;
    color: rgb(51, 51, 51);
    letter-spacing: 2px;
}
.headtitle .tip{
    font-size: 14px;
    color: rgb(153, 153, 153);
    position: absolute;
    right: 0;
    bottom: 0;
}
.topbannerimg{
    display: none;
}
#topBg {
    width: 100%;
    height: 100%;
    position: relative;
    z-index: -100;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 50%;
    background: #000;
    transition: opacity 1s,-webkit-transform 1.5s;
    transition: transform 1.5s,opacity 1s;
    transition: transform 1.5s,opacity 1s,-webkit-transform 1.5s;
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
    opacity: 1;
}

.banner{
    position: relative;
}
.banner .banner_video {
    /* position: fixed;
    top: 0;
    left: 0; */
    width: 100%;
    height: 100%;
    /* overflow: hidden; */
}
.banner .banner_video video {
    width: 100%;
    height: 100%;
    object-fit: cover; 
}
.banner .slogan{
    position: absolute;
    text-align: center;
    top: 45%;
    color: #fff;
    width: 100%;
}
.banner .slogan .a{
    font-size: 40px;
    font-weight: 500;
}
.banner .slogan .b{
    font-size: 20px;
    font-weight: 500;
}

.has_transition_1000 {
    -webkit-transition: -webkit-transform 1000ms cubic-bezier(0.190, 1.000, 0.220, 1.000), opacity 1000ms cubic-bezier(0.190, 1.000, 0.220, 1.000);
    transition: transform 1000ms cubic-bezier(0.190, 1.000, 0.220, 1.000), opacity 1000ms cubic-bezier(0.190, 1.000, 0.220, 1.000);
    will-change: transform, opacity;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}
.distribution{
    padding-top: 70px;
    background: #fff;
}
.distribution .dis-top{
    display: flex;
    align-items: center;
    /* align-items: flex-end; */
}
.distribution .dis-top .dis-top-left {
    flex: 1;
    font-size: 80px;
    font-weight: bold;
    margin-left: 20px;
    line-height: 85px;
}
.distribution .dis-top .dis-top-right {
    display: inline-block;
    position: relative;
    height: 100%;
    /* margin-top: 40px; */
}
.distribution .dis-top .dis-top-right::before {
    content: '';
    position: absolute;
    top: 0;
    left: -18px;
    width: 2px;
    height: calc(100% + 15px);
    background-color: #3e3e3e;
}
.distribution .dis-top  .dis-top-right p{
    margin-bottom: 10px;
    font-weight: 500;
}
.distribution .dis-top  .dis-top-right p:first-child {
    font-size: 14px;
    width: 210px;   
}
.dis-top-right .contact {
    border-bottom: 3px solid #3e3e3e;
}
.dis-top-right p:nth-child(2) {
    font-size: 14px;
    color: #3e3e3e;
}
.dis-bottom {
    width: 100%;
    height: auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.dis-bottom .dis-bottom-left {
    margin-left: 25px;
    margin-top: 20px;
    /* margin-right: 15px; */
}

.dis-bottom .dis-bottom-left .title {
    font-size: 35px;
    /* padding-bottom: 20px; */
    margin-top: 20px;
}

.dis-bottom .dis-bottom-left .thing {
    width: 350px;
    margin-top: 10px;
    padding-bottom: 10px;
    font-size: 14px;
}
.dis-bottom .dis-bottom-left .exhibition{
        width: 350px;
        display: flex;
        flex-direction: column;
}

.dis-bottom .dis-bottom-left .exhibition img{
       width: 100%;
}
.exhibition .countdown{
    width: 100%;
    height: 40px;
    background-color: #2b65af;
    color: #fff;
    display: flex;
    align-items: center;
    padding-left: 20px;
    box-sizing: border-box;
}
.adress{
    font-size: 14px;
}
.adress .icon-sign{
   width: 15px;
   height: 15px;
   margin-right: 5px;
}
.adress .adress-one {
    display: flex;
    align-items: center;
    padding-bottom: 5px;
}
.dis-bottom-right{
    width: 100%;
    position: relative;
    margin-top: 20px;
    /* margin-left: 15px; */
}

.dis-bottom-right .map-box{
    position: relative;
}
.dis-bottom-right .map-box .map{
    width: 100%;
    position: relative;
}
.dis-bottom-right .map-box .point{
     position: absolute;
     color: #262376;
     text-align: center;
}
.dis-bottom-right .point p {
    font-size: 12px;
    font-weight: bold;
    opacity: 0;
    z-index: 10;
}
.dis-bottom-right .map-box .point .point-img{
    width: 15px;
    height:15px;
}
.dis-bottom-right .map-box .point:hover{
    transform: scale(1.7)
}
.dis-bottom-right .map-box .point:hover p{
    opacity: 1;
}

@media screen  and (max-width:1020px){
    .dis-bottom .dis-bottom-left {
        margin-left: 25px;
        margin-top: 20px;
        margin-right: 20px;
    }
 
}
@media screen  and (max-width:995px){
    .dis-bottom{
        flex-wrap: wrap;
    }
}
@media screen  and (max-width:780px){
    .dis-bottom {
        display: block;
    }
    .dis-bottom .dis-bottom-left{
        margin-left: 0px;
        margin-right: 0px;
    }
    .dis-bottom .dis-bottom-left .exhibition{
        display: block;
        width: 100%;
    }
    .dis-bottom .dis-bottom-left .exhibition img{
        width: 100%;
    }
    .distribution {
        padding: 0;
        padding-top: 30px;
    }
    .distribution .dis-top .dis-top-left{
        margin-left: 20px;
        font-size: 40px;
        line-height: normal;
    }
    .distribution .dis-top .dis-top-right{
        margin-right: 10px;
    }
    .distribution .dis-top .dis-top-right p:first-child{
        font-size: 20px;
    }
    .dis-top-right p:nth-child(2) {
        font-size: 14px;
    }
    .dis-bottom-right {
        width: 100%;
        padding-top: 10px;
    }
}
@media screen  and (max-width:500px){
    .distribution {
        padding: 30px 0;
    }
    .distribution .dis-top .dis-top-left {
        display: none;
    }
    .distribution .dis-top .dis-top-right p:first-child{
        width: 100%;
    }
}
.company_profile{
    padding-top: 70px;
    background: #fff;
}
.company_profile .gifbrand{
    width: 100%;
    margin-bottom: 40px;
}
.company_profile  .confile{
    display: flex;
    width: 100%;
}
.company_profile  .confile .left-box{
     width: 45%;
}
.company_profile  .confile .left-box .convid{
    margin-top: 20px;
}
.company_profile .synopsis{
    font-size: 14px;
    line-height: 30px;
    color: rgb(102, 102, 102);
    margin-top: 5px;
    position: relative;
    width: 100%;
}
.company_profile .card{
    padding: 10px 0;
    width: 90%;
    background-color: #fff;
    z-index: 2;
}

.company_profile .right-box{
    /* padding-left: 90px; */
    width: calc(55%);
    padding-left: 70px;
    /* padding-top: 60px; */
}
.company_profile .right-box .small-title{
    text-align: right;
    color: rgb(153, 153, 153);
    font-size: 14px;
    margin-top: 30px;
    margin-bottom: 15px;
}
.company_profile .right-box img{
    width: 100%;
    height: 49%;
    object-fit: cover;
}
.convid-mobile{
    display: none;
    position: relative;
}
@media screen and (max-width: 992px){
    .company_profile  .confile{
        display: block;
    }
    .company_profile  .confile .left-box{
        width: 100%;
   }
    .company_profile .right-box{
        width: calc(100%);
        padding-left: 0px;
        padding-top: 0px;
    }
}
.company_profile .right-box .boxcard{
    width: 100%;
    position: relative;
    top: -70px;
}
.company_profile .right-box .boxcard .card{
    margin: 0 auto;
}
.company_profile .col{
    border-top: 10px;
    position: relative;
}

.company_profile .col::after {
    content: ' ';
    width: 1px;
    background-color: #ddd;
    position: absolute;
    right: 0;
    top: 20px;
    height: 60px;
    /* 自动内减 */
    box-sizing: border-box;
}
.company_profile .col:nth-last-child(1)::after{
    content: none;
}

.company_profile .col .toptext{
    flex-wrap: nowrap;
}

.company_profile .col .toptext .plus{
    font-size: 18px;
    color: #262376;
    margin-top: 8px;
}
.company_profile .col .toptext .a{
    color: #262376;
    font-size: 40px;
}
.company_profile .col .toptext .at{
    color: #262376;
    font-size: 40px;
}
.company_profile .col .toptext .b{
    font-size: 14px;
    color: rgb(153, 153, 153);
    margin-top:35px;
    margin-left:0px;
}
.company_profile .col .bottomtext{
    font-size: 12px;
    color: rgb(102, 102, 102);
    text-align: center;
}
@media screen and (max-width: 540px){
    .company_profile {
        padding: 0;
    }
    .company_profile .col .toptext .a{
        font-size: 30px;
    }
    .company_profile .col .toptext .b{
        margin-top: 25px;
    }
    .company_profile .col .toptext .at{
        font-size: 30px;
    }
    .company_profile .col .toptext #span1{
        font-size: 24px !important;
    }
    .company_profile .col .toptext .plus{
        margin-top: 6px;
    }
    .company_profile  .confile .left-box .convid{
        display: none;
    }
    .convid-mobile{
        display: block;
        position: relative;
        top: -50px;
    }
}
.more{
    font-weight: 600;
    font-size: 20px;
    text-align: center;
    padding: 10px 0;

}

/* .cooperative{
   
} */
.cooperative .container{
    padding-top: 60px;
    padding-bottom: 60px;
}
.cooperative .mainbox{
    padding: 50px 0;

}
.cooperative .mainbox .item{
    width: 100%;
    border: 1px solid #e0dddb;
    background: #fff;
    margin-bottom: 20px;
}
.cooperative .mainbox .item .img{
    width: 100%;
    height: 100%;
    -webkit-transition: all cubic-bezier(.18, 1, .21, 1) .9s;
    -moz-transition: all cubic-bezier(.18, 1, .21, 1) .9s;
    -ms-transition: all cubic-bezier(.18, 1, .21, 1) .9s;
    -o-transition: all cubic-bezier(.18, 1, .21, 1) .9s;
    transition: all cubic-bezier(.18, 1, .21, 1) .9s;
}

.cooperative .mainbox .item:hover .img {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
}

.callmezhix{
    background: #ecf9ff;
}
.callmezhix .container{
    padding: 60px 0;
    text-align: center;
}
.newsMain{
    background: #fff;
}
.newsMain .container{
    padding-top: 60px;
    padding-bottom: 60px;
}
.newsMain .item{
    color: #b8b8b8;;

}
.newsMain .item .a{
    font-size: 14px;
    font-weight: 600;
    color: #b8b8b8;
    margin: 10px 0;
}

.newsMain .item .b{
    font-size: 14px;
    color: #b8b8b8;
    line-height: 24px;
}

.newsMain .item .imgbox img{
    width: 100%;
    height: 150px;
    -webkit-transition: all cubic-bezier(.18,1,.21,1) .9s;
    transition: all cubic-bezier(.18,1,.21,1) .9s;
}


.newsMain .item .imgbox:hover img{
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px);
}

.advantages{
    background: #fff;
    padding-bottom: 10px;
}
.advantages .mainbox{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    width: 100%;
    margin-top: 70px;
}
.triangle-red-fall{
    width: 0;
    height: 0;
    border-left: 5px solid transparent; /* 左边框透明 */
    border-right: 5px solid transparent; /* 右边框透明 */
    border-top: 10px solid red; /* 顶部边框为黑色，高度为两倍的宽度 */
    margin: 0 auto;
}
.advantages .item {
    transition: opacity 1s;
    position: relative;
    padding: 0;
    margin-bottom: 10px;
}
.advantages .first-item{
    width: 63%;
}
.advantages .second-item{
    width: 36%;
}
.advantages .third-item{
    width: 36%;
}
.advantages .fourth-item{
    width: 63%;
}
@media (max-width: 1024px){
    .advantages .item{
       width: 100%;
    }
}

.advantages .fz{
    flex-direction: row-reverse;
}
.advantages .title{
    text-align: center;
    color: rgb(153, 153, 153);
    margin-top: 5px;
    font-size: 14px;
}
.advantages .item .imgbox{
    position: relative;
    width: 100%;
    height: 300px;
    background-color: #262376;
}
.advantages .item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.advantages .item .textbox{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding: 26px 26px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    box-sizing: border-box;
}
.advantages .item  .a{
        font-size: 30px;
        position: absolute;
        bottom: 0;
        color: #fff;
        background-color: #262376;
        padding: 10px 10px;
        border-radius: 10px;
        margin-bottom: 30px;
}

.advantages .item .textbox .b{
    font-size: 16px;
    color:#fff;
}
.advantages .item .imgbox:hover img{
    opacity: 0.1;
    transition: ease-in 0.3s;
}
.advantages .item .imgbox:hover .a{
    bottom: 180px;
        transition: ease-in 0.3s;
        color: #fff;
        background-color: transparent;
}
.advantages .item .imgbox:hover  .timebox .timeitem{
    display: block;
    top: 0;
    opacity: 1;
}
.advantages .item .imgbox:hover  .timebox .timeitem:first-child{
    transition: ease-in 0.3s;
}
.advantages .item .imgbox:hover  .timebox .timeitem:nth-child(2){
    transition: ease-in 0.5s;
}
.advantages .item .imgbox:hover  .timebox .timeitem:nth-child(3){
    transition: ease-in 0.6s;
}
@media screen and (max-width: 540px){
    .advantages{
        padding-top: 0px;
        padding-bottom: 20px;
    }
    .advantages .mainbox{
        margin-top: 40px;
    }
    .advantages .item  .a{
        font-size: 20px;
        box-sizing: border-box;
    }
    .advantages .item .textbox .b{
        font-size: 12px;
    }
}
.slick-prev:before, .slick-next:before{
    color: #000 !important;
}
.slick-dots{
    bottom: -30px !important;
}
.slick-dots li{
    background: #E3E3E3;
    box-sizing: content-box;
    overflow: hidden;
    height: 10px !important;
    width: 10px !important;
    border-radius: 10px !important;
    margin: 0 5px;
    padding: 0px
}
.slick-dots li button{
   
    margin: 0;
    padding: 0
}
.slick-dots .slick-active{
    background: #fff;
    box-sizing: border-box;
    border: 2px solid rgb(30, 80, 174);
}
.slick-dots li button::before{
    content: none !important;
}
.slick-dots{
    margin-bottom: 0;
}
.product .title{
    text-align: center;
    color: rgb(153, 153, 153);
    margin-top: 5px;
    font-size: 14px;
}
.product .container{
    padding-top: 60px;
    padding-bottom: 60px;
}
.product .headtitle{
    text-align: center;
}
.product #normal{
    background: url(../images/Bubble.png);
    background-size: contain;
    background-position: center top;
    background-repeat: no-repeat;
}
.product  #reversal{
    background: url(../images/Bubble-reversal.png);
    background-size: contain;
    background-position: center top;
    background-repeat: no-repeat;
}
.product .productBox {
    width: 100%;
    margin-top: 60px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.product .productBox .pro-info{
    width: 40%;
}
.product .productBox .pro-info h3{
        font-size: 45px;
        /* font-weight: bold; */
        letter-spacing:2px;
}
.product .productBox .pro-info p{
    font-size: 20px;
    word-spacing:2px;
    letter-spacing: 1px;
    margin-top: 5px;
}
.product .productBox .pro-info .searchmore{
    cursor: pointer;
    font-size: 14px;
    margin-top: 10px;
}
.product .productBox .pro-info .searchmore .ax{
    color: #262376;
}
.product .productBox .pro-info .pro-video{
    margin-top: 40px;
}

.product .productBox #pro1{
    width: 45%;
}
.product .productBox #pro2{
    width: 60%;
}
.product .productBox #pro3{
    width: 45%;
}
.product .productBox .pro-pic img:hover{
    transform: scale(1.2);
    transition: 0.5s;
}
.product .productBox .pro-pic img{
    width: 100%;
}

@media (max-width: 1205px){
    .product .productBox .pro-info{
        margin-top: 30px;
    }
    .product .productBox .pro-info .pro-video{
        margin-top: 20px;
    }
}
@media (max-width: 992px){
    .product .productBox .pro-info{
        margin-top: 10px;
    }
    .product .productBox .pro-info h3{
        font-size: 20px;
    }
    .product .productBox .pro-info p{
        font-size: 12px;
    }
    .product .productBox .pro-info .pro-video{
        margin-top: 0px;
    }
}
@media (max-width: 780px){
    .product #normal{
       background: none;
    }
    .product  #reversal{
        background: none;
    }
    .product .productBox {
        display: block;
        text-align: left;
    }
    .product .productBox .pro-info{
        width: 100%;
    }
    .product .productBox .pro-pic{
        width: 100%;
        margin: 0 auto;
    }
    .product .productBox .pro-info .pro-video{
        /* margin-top: 20px; */
        display: none;
    }
    .product #reversal{
        display: flex;
        flex-direction:column-reverse;
    }
    video{
        width: 100% !important;
    }
}
@media (max-width: 540px) {
    .product .container{
        padding-top: 30px;
    }
    .product .productBox {
        margin-top: 10px;
    }
    .product .productBox .pro-info {
        margin-top: 30px;
    }
    .product .productBox .pro-info .pro-video{
        margin-top: 0px;
    }
} 
.morebox{
    text-align: center;
    padding-top: 40px;
}
.btn-more{
    display: inline-block;
    width: 150px;
    height: 50px;
    font-size: 14px;
    border-radius: 20px;
    line-height: 38px;
    border: 1px solid #e0dddb;
    color: #fff;
    padding: 5px 20px;
    background-color: #262376;
}
.btn-more:hover{
    color: #fff;
    background-color: #2b65af;
}
@media (max-width: 768px){
    .company_profile .card{
        width: 100% !important; 
    }
    .company_profile .imgbox{
        padding-left: 15px !important;
        margin-top: 10px;
    }
    .topbannerimg{
        display: block !important;
        background-size: cover;
    }
    #topBg{
        display: none !important;
    }

    .slick-prev { left: 0 !important;  }
    .slick-next { right: 0 !important; }

}
.plan {
    width: 100%;
    height: auto;
    padding-bottom: 60px;
}
.plan .plantext {
}
.plan .big-title{
    text-align: center;
    font-size: 50px;
}
.plan .big-con{
    text-align: center;
    font-size: 30px;
    margin-top: 5px;
}
.plan .small{
    text-align: center;
    font-size: 13px;
    letter-spacing: 2px;
}
.triangle {
    width: 0;
    height: 0;
    border-left: 10px solid transparent; /* 左边框透明 */
    border-right: 10px solid transparent; /* 右边框透明 */
    border-top: 20px solid black; /* 顶部边框为黑色，高度为两倍的宽度 */
    margin: 0 auto;
    margin-top: 20px;
  }
  
.plan .plancon {
    width: 100%;
    display: flex;
    justify-content: center;
}
.plan .plancon .entity{
    width: 90%;
    position: relative;
}
.plan .plancon #dev-one{
    width: 60%;
}
.plan .plancon #dev-one img{
     width: 100%;
}
.plan .plancon #dev-one #no{
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}
.plan .plancon #dev-two{
    width: 80%;
}
.plan .plancon #dev-two #ok{
    width: 100%;
}
.plan .plancon #dev-two #no{
    width: 70%;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
}
.plan .plancon .entity #ok{
    position: relative;
    transform: scale(1);
    z-index: 10;
}
.plan .plancon .entity #no{
    position: absolute;
    z-index: 1;
    opacity: 0;
}
.plan .plancon .entity .device-info{
    position: absolute;
    top: 60%;
    left: 50%;
    transform: translate(-50%);
    font-size:2.5vw;
    white-space:nowrap;
    opacity: 0;
    text-align: center;
}
.plan .plancon .entity .device-info p:nth-child(2){
    font-size: 1vw;
}
.plan .plancon .entity:hover #ok{
    opacity: 0;
    transform: scale(0.3);
    transition: all 0.5s;
}
.plan .plancon .entity:hover #no{
    opacity: 1;
}
.plan .plancon .entity:hover .device-info{
    transition: all 0.5s;
    opacity: 1;
    top: 40%;
    z-index: 99;
    color:#cf8a0d;
}
@media (max-width: 540px){
    .plan .big-title{
        font-size: 30px;
    }
    .plan .big-con{
        font-size: 14px;
    }
}